<template>
  <div>
    <h1>公开活动列表</h1>
    <ul>
      <li v-for="activity in activities" :key="activity.id">
        <router-link :to="`/public-activities/${activity.id}`">{{ activity.title }} - {{ activity.date }}</router-link>
      </li>
    </ul>
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue';
import activities from '../data/activities.js';

const activitiesRef = ref(activities);

onMounted(() => {
  // 可以在这里添加获取活动数据的逻辑
});
</script>